<template>
	<view class="container">
		<view class="avatarshow">
			 <image :src="userInfo.src" mode=""></image>
			 <view>
			 	 <text>修改头像</text>
				 <u-tag text="去认证" type="info" mode="dark"></u-tag>
			 </view>
		</view>
		<view class="userinfo">
			  <u-cell-group>
				   <u-cell-item title="姓名" value="李晓涵" :arrow="false" :center="true"></u-cell-item>
				   <u-cell-item title="工号" value="185255212" :arrow="false" :center="true">
					    <u-icon slot="right-icon" name="../../../static/icon_fz_528.png" size="30"></u-icon>
				   </u-cell-item>
				   <u-cell-item title="地址" value="徐州市鼓楼区"></u-cell-item>
			  </u-cell-group>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:{
					src:'../../../static/avatar.jpg'
				}
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
       page{
		   width: 100%;
		   height: 100%;
	   }
	   .container{
		   width: 100%;
		   height: 100%;
		   background-color: #FFFFFF;
		   .avatarshow{
			   width: 680upx;
			   height: auto;
			   display: flex;
			   align-items: center;
			   margin: auto;
			   margin-top: 80upx;
			   image{
				   border-radius: 100%;
				   width: 120upx;
				   height: 120upx;
			   }
			   .u-mode-dark-info{
				   background-color: rgba(135,135,135,0.5);
				   margin-left: 20upx;
			   }
		   }
		   .avatarshow>view{
			   margin-left: 50upx;
			   text{
				   color: rgba(136, 136, 136, 1);
				   font-size: 30upx;
			   }
		   }
		   .userinfo{
			   width: 680upx;
			   height: auto;
			   margin: auto;
			   margin-top: 50upx;
			   .u-cell{
				   justify-content: flex-start;
			   } 
		   }
	   }
</style>
